<template>
      <div id="zl">
            <div class="info">
                  <div class="title">战略合作</div>
                  <div class="sub">强强联合，与伙伴共创全新智能时代</div>
            </div>

            <div class="imglist">
                  <img :src="item.icon" alt="" v-for="(item, index) in list" :key="index">
            </div>
      </div>
</template>

<script>
      export default {
            data() {
                  return {
                        list: [
                              { icon: require("../../assets/img/ss1.png") },
                              { icon: require("../../assets/img/ss2.png") },
                              { icon: require("../../assets/img/ss3.png") },
                              { icon: require("../../assets/img/ss4.png") },
                        ]
                  }
            },
      }
</script>

<style lang="scss" scoped>
#zl {
      width: 1920px;
      // margin-top: 50px;
      background-color: #eeeeee;
      padding: 50px 0;
      height: 384px;
      margin: 0 auto;
      .info {
            width: 100%;
            text-align: center;
            .title {
                  font-size: 30px;
            }
            .sub {
                  font-size: 18px;
                  margin: 10px 0;
            }
      }
      .imglist {
            width: 1440px;
            margin: 20px auto;
            display: flex;
            justify-content: space-around;
            
      }
}
</style>